<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/layouts/include/taglib.jsp" %>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta name="decorator" content="default" />
<style type="text/css">

.backlist{float:right} 

</style>
</head>
<body>
<div id="addDiv" class="row clearfix collapse">

	<form class="form-horizontal" role="form" name="prjSaveForm" id="prjSaveForm" 
		data-bv-feedbackicons-valid="glyphicon glyphicon-ok"
	    data-bv-feedbackicons-invalid="glyphicon glyphicon-remove"
	    data-bv-feedbackicons-validating="glyphicon glyphicon-refresh"
	>
		<div class="col-xs-12">

			<!-- 设置版本号码隐藏值 -->
			<input type="hidden" id="cfgVersion" name="cfgVersion"></input>
			<!-- 设置项目的uuid -->
			<input type="hidden" id="prjId" id="prjId"></input>
			<input type="hidden" id="selectNumber" id="selectNumber"></input>
			<input type="hidden" id="radioNumber" id="radioNumber"></input>
			
			<div class="row row-default border-ra2 f-mb15">
				<div class="col-xs-12">
					<div class="row row-tt">
						<div class="col-xs-6">
							<h2 class="header header-default">
								<span id="typeTitle">基础信息</span>
							</h2>
						</div>
						<div class="col-xs-6">		
							<a href="javascript:history.go(-1);" class="btn-ace pull-right"><i class="icon-reply"></i> 返回列表</a>
						</div>
					</div>
					
					<div class="row row-content">
						<div>
							<input type="text" id="uuid" name="uuid" value="" style="display: none">
							<input type="text" id="detailUuid" name="detailUuid" value="" style="display: none">
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="prjName" class="col-sm-4 control-label">项目名称</label>
							<div class="col-sm-8 ">
								<input type="text" class="form-control input-sm" id="prjName" name="prjName" value="" placeholder="项目名称(最长22个字符)" maxlength="22" data-bv-notempty data-bv-notempty-message="项目名称必填">
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="prjLvl" class="col-sm-4 control-label">项目级别</label>
							<div class="col-sm-8">
								<tags:select name="prjLvl" id="prjLvl" type="pmPrjLvl" placeholder="项目级别" otherParams="data-bv-notempty data-bv-notempty-message='项目级别必填'"></tags:select>
							</div>
						</div>
						
						<div class="col-sm-4 f-mb15" >
							<label for="prjType" class="col-sm-4 control-label">项目类别</label>
							<div class="col-sm-8">
								<tags:select name="prjType" id="prjType" type="pmProjectType" hasBlank="true"></tags:select>
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="prjNo" class="col-sm-4 control-label">项目设计号</label>
							<div class="col-sm-8 ">
								<input type="text" class="form-control input-sm" id="prjNo" name="prjNo" value="" placeholder="项目设计号">
							</div>
						</div>
						
						<div class="col-sm-4 f-mb15" >
							<label for="projectSize" class="col-sm-4 control-label">项目规模</label>
							<div class="col-sm-8 ">
								<input type="text" class="form-control input-sm" id="projectSize" name="projectSize" placeholder="请输入项目规模">
								
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="custNo" class="col-sm-4 control-label">客户名称</label>
							<div class="col-sm-8 ">
								<input type="text" class="form-control input-sm" id="custNo" name="custNo" placeholder="客户名称" >
							</div>
						</div>
						
						<div class="col-sm-4 f-mb15" >
							<label for="invest" class="col-sm-4 control-label">投资额</label>
							<div class="col-sm-8">
								<input type="text" class="form-control input-sm" id="invest" name="invest" placeholder="投资额" >
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="investment" class="col-sm-4 control-label">投资单位</label>
							<div class="col-sm-8">
								<input type="text" class="form-control input-sm" id="investment" name="investment" placeholder="投资单位" >
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="contracts" class="col-sm-4 control-label">合同额</label>
							<div class="col-sm-8">
								<input type="text" class="form-control input-sm" id="contracts" name="contracts" placeholder="合同额" >
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="contractno" class="col-sm-4 control-label">合同编号</label>
							<div class="col-sm-8">
								<input type="text" class="form-control input-sm" id="contractno" name="contractno" placeholder="合同编号" >
							</div>
						</div>
						
						<div class="col-sm-4 f-mb15" >
							<label for="startDate" class="col-sm-4 control-label">项目时间</label>
							<div class="col-sm-8">
								<div class="input-group input-daterange" data-provide="datepicker" >
								    <input type="text" class="input-sm form-control" name="startDate" id="startDate" />
								    <span class="input-group-addon">至</span>
								    <input type="text" class="input-sm form-control" name="endDate" id="endDate"/>
							    </div>
						    </div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="takeUnit" class="col-sm-4 control-label">承接单位</label>
							<div class="col-sm-8 ">
								 <input type="text" class="form-control input-sm" name="takeUnit" id="takeUnit" placeholder="承接单位" data-bv-notempty data-bv-notempty-message="承接单位必填">
							</div>
						</div>
						<div class="col-sm-4 f-mb15" >
							<label for="depict" class="col-sm-4 control-label">项目描述</label>
							<div class="col-sm-8 ">
								<textarea rows="3" cols="20" class="form-control input-sm" id="depict" name="depict" placeholder="项目描述"></textarea>
							</div>
						</div>
						
						
						
					</div> <!-- row-content -->
				</div>
			</div>
			
			<div class="row row-default border-ra2"">
				<div class="col-xs-12">
					<div class="row row-tt">
						<div class="col-xs-12">
							<h2 class="header header-default">
								配置信息
					  		 </h2>
					  	</div>	 
					</div>
					<div class="row row-content">
						<div class="col-xs-12">
					   		<div class="row" id="typeInfo">
			                   
			               	</div>
			               	<div class="row" id="selectInfo">
			               	
			               	</div>
			               	<div class="row" id="radioInfo">
			               	
			               	</div>
			            </div>   	
	               	</div>
               	</div>
            </div>
            
           	<!--  撑页面 -->	
            <div class="space-30"></div>
            
            <div class="button-submit" >
                <button class="btn  btn-success f-mr20" type="button" onclick="save()"><i class="icon-save"></i>保存</button>
                <button class="btn  btn-default" type="reset" onclick="abort();"><i class="icon-remove"></i>重置</button>
            </div>
         </div>
	</form>
</div>
		
<script >
//修改项目信息时候得到uuid
var uuid = "${param.id}";
var prjStatus = "${param.status}";
$(document).ready(function() {
	//用于判断是新增项目还是修改项目
	if (prjStatus) {
		$(".button-submit").hide();
	}
	var status="新增";
	$('#prjSaveForm').bootstrapValidator();
	$("#addDiv").collapse('show');
	
	if(uuid == ""){
		startdetail($('#prjType').val(),status);
	}
	else{
		status="修改";
		$("#uuid").val(uuid);
		$('#typeTitle').text("项目修改");
		Otod.ajax({
			url:"${ctx}/pm/project/getprojectById.do?id="+uuid,
			contentType: "application/x-www-form-urlencoded;",
			successFn:function(data){
				$('#uuid').val(data.uuid);
				$('#prjName').val(data.prjName);
				$('#prjType').val(data.prjType);
				$('#prjLvl').val(data.prjLvl);
				$('#projectSize').val(data.projectSize);
				$('#custNo').val(data.custNo);
				$('#prjNo').val(data.prjNo);
				$('#invest').val(data.invest);
				$('#investment').val(data.investment);
				$('#contracts').val(data.contracts);
				$('#contractno').val(data.contractno);
				$('#startDate').val(DateUtil.dateFormat(data.startDate));
				$('#endDate').val(DateUtil.dateFormat(data.endDate));
				$('#status').val(data.status);
				$('#depict').val(data.depict);
				$('#takeUnit').val(data.takeUnit);
				//Otod.Msg.info("查询成功成功！");
				startdetail($('#prjType').val(),status,uuid);
				//禁用标签
				$("#prjType").attr("disabled","disabled");
				$("#startDate").attr("disabled","disabled");
				
				//判断项目是否完成 或者终止
				if (data.status =='30090003'||data.status =='30090004') {
					$(".button-submit").hide();
				}
				
				
			}
		});
		
		
	}
	
	/* each(function(i){
		alert(this.val());
	}); */
});


//当选择项目类型改变的时候
$("#prjType").change(function() {		
	  startdetail($(this).val(),status);
});


function setRadio(){
	$("div[name='selectRadio']").each(function(){		
		$('#'+this.id).append($("#radioSelectList"));
	}); 	
}

//下拉列别框变更的时候调用的方法  和 加载 detail表信息 的时候的方法
function startdetail(prjType,status,uuid){
	
	var radio=0;
	 Otod.ajax({
		//通过项目类型查询出字段 状态 其中状态20000001是可用
		url:"${ctx}/pm/detail/queryPrjtype.do",
		data: {prjType:prjType,uuid:uuid},
		type: "GET",
		successFn: function(data){
			//动态生成数据列表
			var sb = new StringBuffer();
			//动态生成下拉
			var selectsb = new StringBuffer();
			//动态生成单选列表
			var radiosb = new StringBuffer();
				//动态生成 列表框
				$.each(data, function(i, n){	
				    /*   var obj = jQuery.parseJSON(n.fieldRela); */
						if(i==0){
							version = n.version;	
							$("#cfgVersion").val(version);	
						} 
							//取出相关类型							
							if(data[i].fieldType=="VARCHAR"||data[i].fieldType=="varchar"){
								sb.append('<div class="col-sm-4 f-mb15">');
								sb.append('<label for="'+data[i].fieldName+'" class="col-sm-4 control-label">').append(data[i].fieldcommonts).append('</label>');
								sb.append('<div class="col-sm-8">');
								sb.append('<input type="text" class="form-control input-sm" id="'+data[i].fieldName+'" name="'+data[i].fieldName+'" placeholder="'+data[i].fieldcommonts+'" data-bv-notempty data-bv-notempty-message="此外有误" >');  
								sb.append('</div>');
								sb.append('</div>');
							}else if(data[i].fieldType=="long"){
								sb.append('<div class="col-sm-4 f-mb15">');
								sb.append('<label for="'+data[i].fieldName+'" class="col-sm-4 control-label">').append(data[i].fieldcommonts).append('</label>');
								sb.append('<div class="col-sm-8">');
								sb.append('<input type="long" class="form-control input-sm" id="'+data[i].fieldName+'" name="'+data[i].fieldName+'" placeholder="'+data[i].fieldcommonts+'" data-bv-notempty data-bv-notempty-message="此外有误" >');  
								sb.append('</div>');
								sb.append('</div>');
							}else if(data[i].fieldType=="date"){
								sb.append('<div class="col-sm-4 f-mb15">');
								sb.append('<label for="'+data[i].fieldName+'" class="col-sm-4 control-label">').append(data[i].fieldcommonts).append('</label>');
								sb.append('<div class="col-sm-8">');
								sb.append('<input type="date" class="form-control input-sm" id="'+data[i].fieldName+'" name="'+data[i].fieldName+'" placeholder="'+data[i].fieldcommonts+'" data-bv-notempty data-bv-notempty-message="此外有误" >');  
								sb.append('</div>');
								sb.append('</div>');
							}else if(data[i].fieldType=="decimal"){
								sb.append('<div class="col-sm-4 f-mb15">');
								sb.append('<label for="'+data[i].fieldName+'" class="col-sm-4 control-label">').append(data[i].fieldcommonts).append('</label>');
								sb.append('<div class="col-sm-8">');
								sb.append('<input type="decimal" class="form-control input-sm" id="'+data[i].fieldName+'" name="'+data[i].fieldName+'" placeholder="'+data[i].fieldcommonts+'" data-bv-notempty data-bv-notempty-message="此外有误" >');  
								sb.append('</div>');
								sb.append('</div>');
							}else if(data[i].fieldType=="select"){	
								selectsb.append('<div class="col-sm-4 f-mb15">');
								selectsb.append('<label for="'+data[i].fieldName+'" class="col-sm-4 control-label">').append(data[i].fieldcommonts).append('</label>');
								selectsb.append('<div class="col-sm-8" name="selectList"').append('>');
								selectsb.append('<select class="form-control" id="').append(data[i].fieldName).append("\"").append('name="').append(data[i].fieldName).append("\"").append('>');
								$.each(data[i].codeList,function(j,n){
									selectsb.append('<option value="').append(n.codeNo).append("\">").append(n.codeName).append('</option>');		
								})
								selectsb.append('</select>');
								selectsb.append('</div>');
								selectsb.append('</div>'); 
							}else if(data[i].fieldType=="radio"){
								radio=radio+1;
								$("#radioNumber").val(radio);
								radiosb.append('<div class="col-sm-10 f-mb15">');
								radiosb.append('<label for="'+data[i].fieldName+'" class="col-sm-2 control-label">').append(data[i].fieldcommonts).append('</label>');
								radiosb.append('<div class="col-sm-8" name="radioList" id="radio').append(radio).append("\"").append('>');	
								$.each(data[i].codeList,function(j,n){
									radiosb.append(' ');
									radiosb.append('<button type="button" class="btn btn-xs btn-checkBox  dynamic" data-toggle="button" onclick="changeState(this,event);" id="button').append(j).append('" name="').append(n.code).append('" value="').append(n.codeNo).append(';').append(data[i].fieldName).append('"> <i class="icon-ok"></i>');	
									radiosb.append(n.codeName);
									radiosb.append('</button>')
								})
								radiosb.append('</div>');
								radiosb.append('</div>'); 
							}
				});				
			$("#typeInfo").html(sb.toString()); 
			$("#selectInfo").html(selectsb.toString());
			$("#radioInfo").html(radiosb.toString());
			//调用查询项目id的方法
			if(status!="新增"){
				selectDetail(uuid,version);
			}	
		}	
		
	 });
		/* .blur(function(){
			alert($(this).val());
		}); */
}
//通过 项目类型的id 和version 最大版本号码查询数据   detail
function selectDetail(uuid,version){
	//得到相同名字下的id 然后赋值
	Otod.ajax({
		//通过项目类型查询出字段 状态 其中状态20000001是可用
		url:"${ctx}/pm/detail/selectDetail.do",
		data: {prjId:uuid,cfgVersion:version},
		type: "GET",
		successFn: function(data){
			$("#detailUuid").val(data.uuid);
			//查询相关数据 通过项目属性uuid 和最大版本号码
			//得到div下面所有的input 
			$("#typeInfo input").each(function(index){
				if(this.id != null){
					$(this).val(eval('data.' +  this.id));
				}	
				
			});
			
			$("input[name='telephone']").on('blur',function(e){
				checkIsNum($(this),$(this).val());
			});
			$("input[name='fax']").on('blur',function(e){
				checkIsNum($(this),$(this).val());
			});
			$("input[name='postcode']").on('blur',function(e){
				checkIsNum($(this),$(this).val());
			});
				
			$("#typeInfo select").each(function(index){
				if(this.id != null){
					$(this).val(eval('data.' +  this.id));
				}	
			});
			//列表信息
			  $("#radioInfo div").each(function(index){	
				if(this.id!=null){
					if(this.id!=""){
						 for(var i=0;i<$("#radioInfo div button").children().length;i++){		
								var splitValue =$("#radioInfo div button").eq(i).val().split(";");
								if(splitValue[0]==eval('data.' + splitValue[1])){
										   $("#button"+i).addClass("active")				} 
							}						 
					}	
				}	
			}); 
		}
	});
}
function addPrj(obj){
	$("#addDiv").collapse('show');	
}
//取消
function abort(){
	$('#prjSaveForm').data('bootstrapValidator').resetForm();
}

function checkIsNum(obj,value){
	if(isNaN(value)){ 
		   alert('此项必须是数字，请重新输入！'); 
		   obj.focus();
		   return false; 
		}else{
			return true;
		}
}
//保存
function save(){
	if(!$('#prjSaveForm').data('bootstrapValidator').validate().isValid()){
		return;
	}
	//得到动态添加列表单选的值 
	 var radio = new StringBuffer();
	for(var i=1;i<=$("#radioNumber").val();i++){
		var strs = $("#radio"+i).children(".active");
		strs.each(function(j,t) {
			if(i==1){
				radio =$(t).val();
			}else{
				radio =radio + ","+$(t).val();
			}
		});
	}
	Otod.ajax({
		url:"${ctx}/pm/project/savePrj.do?radio="+radio,
		data: $('#prjSaveForm').serialize(),
		contentType: "application/x-www-form-urlencoded;",
		successFn:function(data){
			$('#prjSaveForm button[type=reset]').click();		//重置form
			window.location.href="step.jsp?prjId="+data.uuid+"&prjType="+data.prjType;
		}
	});
}
function changeState(a,b){
	$(a).addClass(".active");
	$(a).siblings(".active").removeClass("active");
}; 



</script>	
</body>
</html>
